<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <style>
     td{
	     margin:0;
		 padding:0;
		 border:solid 1px black;
	 }
	 table{
	    border-collapse:collapse;
		border-spacing:0;
		border:1px black solid;
		width:500px;
		text-align:center;
	 }
	 
  
  </style>
  <script src="jquery-3.3.1.js"></script>
 </head>
 <body>
   <div id="div1">11111</div>
   <div class="div2">22222</div>
   <div class="div2">33333</div>
   <div class="div2">44444</div>
   <div class="div2">55555</div>

   <table>
      <tr> <td>用户名</td><td>年龄</td><td>爱好</td> </tr>
	  <tr> <td>小红</td><td>15</td><td>看动漫</td> </tr>
	  <tr> <td>小明</td><td>12</td><td>打羽毛球</td> </tr>
	  <tr> <td>小美</td><td>18</td><td>游泳</td> </tr>
	  <tr> <td>小萌</td><td>16</td><td>看动漫</td> </tr>
   </table>

 </body>
 <script>
 
    $(function(){
	   var $all = $("*");  //获取页面中所有的标签元素
	   console.log($all.length);

       var $div = $(".div2"); //类选择器 
       
	   //过滤选择器
	   console.log($("div:first").text());
	   console.log($("div:last").text());
       console.log($("div:contains('2')").text());
       
       
	  $("tr:odd").css({"backgroundColor":"#eee"});
      $("tr:even").css({"backgroundColor":"rgb(204,204,204)"});
      
      //属性选择器

	  //筛选
	  $("tr").click(function(){
	     $(this).css({"backgroundColor":"#ccc"});
		 $(this).siblings().css({"backgroundColor":"white"});
	  });

	});

 </script>
</html>
